@import "./note-header/note-header-sizes";
@import "../../ui/style/spacing";
@import "../../ui/style/typography";
@import "../../ui/form-field/form-field-sizes";

:host {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.NoteEditor {
    &__scrollable {
        overflow-y: auto;
        scroll-behavior: smooth;
        padding-bottom: $spacing-triple;
    }

    &__titleEdit {
        min-height: min-content;
        padding: $spacing;
    }

    &__stacks {
        min-height: $note-header-size;
        padding: 2.5px $spacing;

        label {
            margin-right: $spacing-half;
        }

        .ChipList {
            margin: 2px 0;
        }

        input.ChipInput {
            min-width: 100px;
            background: transparent;
            border: none;
            outline: 0;
            margin: 0;
            padding: 0 $spacing-half;
            height: $form-control-size;
        }
    }

    &__stackChip {
        gd-stack-item {
            margin-right: $spacing-half;
        }
    }

    &__titleTextarea {
        padding-bottom: $spacing;

        > textarea {
            display: block;
            width: 100%;
            resize: none;
            padding: $spacing-half;
            outline: 0;
            font-size: $font-size-md;
            font-weight: $font-weight-semiBold;
            border: 1px solid transparent;
            border-radius: 5px;
            overflow: hidden;
            background: transparent;
            color: inherit;
        }
    }

    &__snippetsContainer {
    }

    &__snippetsList {
        padding: 0 $spacing;
        height: fit-content;
    }
}
